import Modal from "../封装Modal"
import { Component, ReactNode } from "react"

// 声明state
type Istate = {
    isShow: boolean
}
class ShowModal extends Component<any,Istate> {
    state = {
        isShow: false
    }

    // 点击显示Modal
    handleClick = () => {
        this.setState({
            isShow: true
        })
    }

    // 取消按钮
    handleCancel = () => {
        alert('点击了确定')
        this.setState({
            isShow:false
        })
    }

    // 确定按钮
     handleOk = () => {
        alert('点击了取消')
        this.setState({
            isShow:false
        })
    }

    render(): ReactNode {
        // 结构state中的isShow
        let { isShow } = this.state
        return(
            <fieldset>
                <legend>展示modal</legend>
                <Modal open={isShow} title="充值提示" onCancel={this.handleCancel} onOk={this.handleOk}>
                    <p>请充值VIP</p>
                </Modal>
                <button onClick={this.handleClick}>点击</button>
            </fieldset>
        )
    }
}

export default ShowModal